<!DOCTYPE html>
<html lang="en" xmlns:th="http://thyneleaf.org" xmlns:https="http://www.w3.org/1999/xhtml">
<head>

    <!-- Basic page needs
	============================================ -->
    <title></title>
    <meta charset="utf-8">
    <meta name="keywords" content="" />
    <meta name="author" content="Magentech">
    <meta name="robots" content="index, follow" />

    <!-- Mobile specific metas
    ============================================ -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <!-- Favicon
    ============================================ -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="../ico/apple-touch-icon-57-precomposed.png">
    <link rel="shortcut icon" href="../ico/favicon.png">

    <!-- Google web fonts
    ============================================ -->
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,300' rel='stylesheet' type='text/css'>

    <!-- Libs CSS
	============================================ -->
    <link rel="stylesheet" href="../css/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css">
    <link href="../js/datetimepicker/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <link href="../js/owl-carousel/owl.carousel.css" rel="stylesheet">
    <link href="../css/themecss/lib.css" rel="stylesheet">
    <link href="../js/jquery-ui/jquery-ui.min.css" rel="stylesheet">

    <!-- Theme CSS
    ============================================ -->
    <link href="../css/themecss/so_megamenu.css" rel="stylesheet">
    <link href="../css/themecss/so-categories.css" rel="stylesheet">
    <link href="../css/themecss/so-listing-tabs.css" rel="stylesheet">

    <link id="color_scheme" href="../css/theme.css" rel="stylesheet">

    <link href="../css/responsive.css" rel="stylesheet">



</head>

<body class="res layout-subpage banners-effect-6">



<div id="wrapper" class="wrapper-full ">
    <!-- Header Container  -->
    <header id="header" class=" variantleft type_1">
        <!-- Header Top -->
        <div class="header-top">
            <div class="container">
                <div class="row">
                    <div class="header-top-right collapsed-block text-right  col-sm-6 col-xs-12 compact-hidden">
                        <h5 class="tabBlockTitle visible-xs">More<a class="expander " href="#TabBlock-1"><i class="fa fa-angle-down"></i></a></h5>
                        <div class="tabBlock" id="TabBlock-1">
                            <ul class="top-link list-inline">
                                <li class="account" id="my_account">
                                    <a href="#" title="My Account" class="btn btn-xs dropdown-toggle" data-toggle="dropdown"> <span >My Account</span> <span class="fa fa-angle-down"></span></a>
                                    <ul class="dropdown-menu ">
                                        <li><a href="/account/ViewNewAccount"><i class="fa fa-user"></i> Register</a></li>
                                        <li><a href="/account/viewlogin">
                                            <i class="fa fa-pencil-square-o"></i> Login</a></li>
                                    </ul>
                                </li>
                                <li class="wishlist"><a href="/account/viewWishList" id="wishlist-total" class="top-link-wishlist" title="Wish List"><span>Wish List</span></a></li>
                                <li class="checkout"><a href="/order/ViewListOrder" class="top-link-checkout" title="Checkout"><span >My Order</span></a></li>
                                <li class="login"><a href="/cart/ViewCart" title="Shopping Cart"><span >Shopping Cart</span></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- //Header Top -->

        <!-- Header center -->
        <div class="header-center left">
            <div class="container">
                <div class="row">
                    <!-- Logo -->
                    <div class="navbar-logo col-md-3 col-sm-12 col-xs-12">
                        <a href="index.html"><img src="../images/demo/logos/theme_logo.png" title="Your Store" alt="Your Store" /></a>
                    </div>
                    <!-- //end Logo -->

                    <!-- Search -->
                    <div id="sosearchpro" class="col-sm-7 search-pro">
                        <form method="post" action="/category/SearchProducts">
                            <div id="search0" class="search input-group">
                                <div class="select_category filter_type icon-select">
                                    <select class="no-border" name="category_id">
                                        <option value="0">All Categories</option>
                                    </select>
                                </div>
                                <input class="autosearch-input form-control" type="text" id="keyword" size="50" autocomplete="off" placeholder="Search" name="keyword">
                                <div class="auto hidden" id="auto">
                                    <div class="auto_out">1</div>
                                    <div class="auto_out">2</div>
                                </div>
                                <span class="input-group-btn">
						    <button type="submit" class="button-search btn btn-primary" name="submit_search"><i class="fa fa-search"></i></button>
						</span>
                            </div>
                            <input type="hidden" name="route" value="product/search" />
                            <script src="../js/searchProduct.js"></script>
                        </form>
                    </div>
                    <!-- //end Search -->

                    <!-- Secondary menu -->
                    <div class="col-md-2 col-sm-5 col-xs-12 shopping_cart pull-right">
                        <!--cart-->
                        <div id="cart" class=" btn-group btn-shopping-cart">
                            <a data-loading-text="Loading..." class="top_cart dropdown-toggle" data-toggle="dropdown">
                                <div class="shopcart">
                                    <span class="handle pull-left"></span>
                                    <span class="title">My cart</span>
                                </div>
                            </a>

                            <ul class="tab-content content dropdown-menu pull-right shoppingcart-box" role="menu">

                                <li>
                                    <table class="table table-striped">
                                        <tbody>
                                        <tr>
                                            <td class="text-center" style="width:70px">
                                                <a href="product.html"> <img src="../images/demo/shop/product/35.jpg" style="width:70px" alt="Filet Mign" title="Filet Mign" class="preview"> </a>
                                            </td>
                                            <td class="text-left"> <a class="cart_product_name" href="product.html">Filet Mign</a> </td>
                                            <td class="text-center"> x1 </td>
                                            <td class="text-center"> $1,202.00 </td>
                                            <td class="text-right">
                                                <a href="product.html" class="fa fa-edit"></a>
                                            </td>
                                            <td class="text-right">
                                                <a onclick="cart.remove('2');" class="fa fa-times fa-delete"></a>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td class="text-center" style="width:70px">
                                                <a href="product.html"> <img src="../images/demo/shop/product/141.jpg" style="width:70px" alt="Canon EOS 5D" title="Canon EOS 5D" class="preview"> </a>
                                            </td>
                                            <td class="text-left"> <a class="cart_product_name" href="product.html">Canon EOS 5D</a> </td>
                                            <td class="text-center"> x1 </td>
                                            <td class="text-center"> $60.00 </td>
                                            <td class="text-right">
                                                <a href="product.html" class="fa fa-edit"></a>
                                            </td>
                                            <td class="text-right">
                                                <a onclick="cart.remove('1');" class="fa fa-times fa-delete"></a>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </li>
                                <li>
                                    <div>
                                        <table class="table table-bordered">
                                            <tbody>
                                            <tr>
                                                <td class="text-left"><strong>Sub-Total</strong>
                                                </td>
                                                <td class="text-right">$1,060.00</td>
                                            </tr>
                                            <tr>
                                                <td class="text-left"><strong>Eco Tax (-2.00)</strong>
                                                </td>
                                                <td class="text-right">$2.00</td>
                                            </tr>
                                            <tr>
                                                <td class="text-left"><strong>VAT (20%)</strong>
                                                </td>
                                                <td class="text-right">$200.00</td>
                                            </tr>
                                            <tr>
                                                <td class="text-left"><strong>Total</strong>
                                                </td>
                                                <td class="text-right">$1,262.00</td>
                                            </tr>
                                            </tbody>
                                        </table>
                                        <p class="text-right"> <a class="btn view-cart" href="#"><i class="fa fa-shopping-cart"></i>View Cart</a>&nbsp;&nbsp;&nbsp; <a class="btn btn-mega checkout-cart" href="#"><i class="fa fa-share"></i>Checkout</a> </p>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <!--//cart-->
                    </div>
                </div>

            </div>
        </div>
        <!-- //Header center -->

        <!-- Header Bottom -->
        <div class="header-bottom">
            <div class="container">
                <div class="row">

                    <div class="sidebar-menu col-md-3 col-sm-6 col-xs-12 ">
                        <div class="responsive so-megamenu ">
                            <div class="so-vertical-menu no-gutter compact-hidden">
                                <nav class="navbar-default">

                                    <div class="container-megamenu vertical  ">

                                        <div id="menuHeading">
                                            <div class="megamenuToogle-wrapper">
                                                <div class="megamenuToogle-pattern">
                                                    <div class="container">
                                                        <div>
                                                            <span></span>
                                                            <span></span>
                                                            <span></span>
                                                        </div>
                                                        All Categories
                                                        <i class="fa pull-right arrow-circle fa-chevron-circle-up"></i>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="navbar-header">
                                            <button type="button" id="show-verticalmenu" data-toggle="collapse" class="navbar-toggle fa fa-list-alt">

                                            </button>
                                            All Categories
                                        </div>
                                        <div class="vertical-wrapper" >
                                            <span id="remove-verticalmenu" class="fa fa-times"></span>
                                            <div class="megamenu-pattern">
                                                <div class="container">
                                                    <ul class="megamenu">
                                                        <li class="item-vertical style1 with-sub-menu hover" th:each="category : ${categoryList}">
                                                            <p class="close-menu"></p>
                                                            <a href="#" class="clearfix">
                                                                <img src="../images/theme/icons/9.png" alt="icon">
                                                                <span><th:block th:text="${category.categoryId}" /></span>
                                                                <b class="caret"></b>
                                                            </a>
                                                            <div class="sub-menu" data-subwidth="100" >
                                                                <div class="content" >
                                                                    <div class="row">
                                                                        <div class="col-sm-12">
                                                                            <div class="row">
                                                                                <div class="col-md-4 static-menu">
                                                                                    <div class="menu">
                                                                                        <ul>
                                                                                            <li>
                                                                                                <a href="#"  class="main-menu">Products</a>
                                                                                                <ul>
                                                                                                    <li th:if = "${category.categoryId}==${product.categoryId}" th:each="product : ${productList}"><a th:href="${'/category/ViewProduct?productId='}+${product.productId}"><th:block th:text="${product.productId}" />
                                                                                                        <th:block th:utext="${product.descn}" /></a></li>
                                                                                                </ul>
                                                                                            </li>
                                                                                        </ul>
                                                                                    </div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </li>
                                                        <li class="loadmore">
                                                            <i class="fa fa-plus-square-o"></i>
                                                            <span class="more-view">More Categories</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </nav>
                            </div>
                        </div>
                    </div>

                    <!-- Main menu -->
                    <div class="megamenu-hori header-bottom-right  col-md-9 col-sm-6 col-xs-12 ">
                        <div class="responsive so-megamenu ">
                            <nav class="navbar-default">
                                <div class=" container-megamenu  horizontal">

                                    <div class="navbar-header">
                                        <button type="button" id="show-megamenu" data-toggle="collapse" class="navbar-toggle">
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                            <span class="icon-bar"></span>
                                        </button>
                                        Navigation
                                    </div>

                                    <div class="megamenu-wrapper">
                                        <span id="remove-megamenu" class="fa fa-times"></span>
                                        <div class="megamenu-pattern">
                                            <div class="container">
                                                <ul class="megamenu " data-transition="slide" data-animationtime="250">
                                                    <li class="home hover">
                                                        <a href="/Main/enter">Home <b class="caret"></b></a>
                                                    </li>
                                                    <li class="with-sub-menu hover">
                                                        <p class="close-menu"></p>
                                                        <a href="#" class="clearfix">
                                                            <strong>Account</strong>
                                                            <span class="label"> Hot</span>
                                                            <b class="caret"></b>
                                                        </a>
                                                        <div class="sub-menu" style="width: 20%; right: auto;">
                                                            <div class="content" >
                                                                <div class="row">
                                                                    <div class="col-md-3">
                                                                        <div class="column">
                                                                            <a href="#" class="title-submenu">AccountController</a>
                                                                            <div>
                                                                                <ul class="row-list">
                                                                                    <li><a href="/account/viewlogin">SignOnPage </a></li>
                                                                                    <li><a href="/account/ViewNewAccount">RegisterPage</a></li>
                                                                                    <li><a href="/account/ViewEditInformationFormServlet">EditInformationPage</a></li>
                                                                                </ul>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    <li class="with-sub-menu hover">
                                                        <p class="close-menu"></p>
                                                        <a href="/cart/ViewCart" class="clearfix">
                                                            <strong>Cart</strong>
                                                            <span class="label"> Hot</span>
                                                            <b class="caret"></b>
                                                        </a>
                                                        <div class="sub-menu" style="width: 40%; ">
                                                            <div class="content" >
                                                                <div class="row">
                                                                    <div class="col-md-6">
                                                                        <ul class="row-list">
                                                                            <li><a class="subcategory_item" href="/cart/ViewCart">MycartPage</a></li>
                                                                            <li><a class="subcategory_item" href="/order/ViewListOrder">MyOrderPage</a></li>
                                                                            <li><a class="subcategory_item" href="/account/viewWishList">MyWishPage</a></li>
                                                                            <li><a class="subcategory_item" href="/Main/viewsendmail">Contact us</a></li>
                                                                        </ul>
                                                                    </div>
                                                                    <div class="col-md-6">
                                                                        <ul class="row-list">
                                                                            <li><a class="subcategory_item" href="#">About Us 1</a></li>
                                                                            <li><a class="subcategory_item" href="#">About Us 2</a></li>
                                                                            <li><a class="subcategory_item" href="#">About Us 3</a></li>
                                                                            <li><a class="subcategory_item" href="#">About Us 4</a></li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </nav>
                        </div>
                    </div>
                    <!-- //end Main menu -->

                </div>
            </div>

        </div>
    </header>
    <!-- //Header Container  -->
    <!-- Main Container  -->
    <div class="main-container container">
        <ul class="breadcrumb">
            <li><a href="#"><i class="fa fa-home"></i></a></li>
            <li><a href="#">JPetStore</a></li>
        </ul>

        <div class="row">
            <!--Left Part Start -->
            <aside class="col-sm-4 col-md-3" id="column-left">
                <div class="module menu-category titleLine">
                    <h3 class="modtitle">Categories</h3>
                    <div class="modcontent">
                        <div class="box-category" >
                            <ul id="cat_accordion" class="list-group">
                                <li class="hadchild" th:each="category : ${categoryList}"><a class="cutom-parent" th:href="${'/category/ViewCategory?categoryId='}+${category.categoryId}"><th:block th:text="${category.categoryId}" /></a>
                                    <span class="button-view  fa fa-plus-square-o"></span>
                                    <ul style="display: none;" th:each="product : ${productList}">
                                        <li th:if = "${category.categoryId}==${product.categoryId}"><a th:href="${'/category/ViewProduct?productId='}+${product.productId}"><th:block th:text="${product.productId}" /></a></li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="module latest-product titleLine">
                    <h3 class="modtitle">Latest Product</h3>
                    <div class="modcontent ">
                        <div class="product-latest-item">
                            <div class="media" th:each="latestproduct : ${latestProducts}">
                                <div class="media-left">
                                    <a th:href="${'/category/ViewItem?itemId='}+${latestproduct.itemid}"><th:block th:utext="${latestproduct.descn}" class="img-responsive" style="width: 100px; height: 82px;"/></a>
                                </div>
                                <div class="media-body">
                                    <div class="caption">
                                        <h4><a th:href="${'/category/ViewItem?itemId='}+${latestproduct.itemid}"><th:block th:text="${latestproduct.itemid}" /></a></h4>

                                        <div class="price">
                                            <span class="price-new"><th:block th:text="${latestproduct.listprice}" /></span>
                                        </div>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="module">
                    <div class="modcontent clearfix">
                        <div class="banners">
                            <div>
                                <a href="#"><img src="../images/demo/cms/leftfoot.jpg" alt="left-../images" style="width: 300px;height:322px"
                                ></a>
                            </div>
                        </div>

                    </div>
                </div>
            </aside>
            <!--Left Part End -->

            <!--Middle Part Start-->
            <div id="content" class="col-md-9 col-sm-8">
                <div class="products-category">
                    <div class="category-derc">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="banners">
                                    <div>
                                        <a  href="#"><img src="../images/demo/shop/category/shouyetu.jpg" alt="Apple Cinema 30&quot;" style="width: 870px;height:260px"><br></a>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <!-- Filters -->
                    <div class="product-filter filters-panel">
                        <div class="row">
                            <div class="col-md-2 visible-lg">
                                <div class="view-mode">
                                    <div class="list-view">
                                        <button class="btn btn-default grid active" data-view="grid" data-toggle="tooltip"  data-original-title="Grid"><i class="fa fa-th"></i></button>
                                        <button class="btn btn-default list" data-view="list" data-toggle="tooltip" data-original-title="List"><i class="fa fa-th-list"></i></button>
                                    </div>
                                </div>
                            </div>
                            <div class="short-by-show form-inline text-right col-md-7 col-sm-8 col-xs-12">
                                <div class="form-group">
                                    <label class="control-label" for="input-limit">Show:</label>
                                    <select id="input-limit" class="form-control" onchange="location = this.value;">
                                        <option value="" selected="selected">9</option>
                                        <option value="">25</option>
                                        <option value="">50</option>
                                        <option value="">75</option>
                                        <option value="">100</option>
                                    </select>
                                </div>
                            </div>
                            <div class="box-pagination col-md-3 col-sm-4 col-xs-12 text-right">
                                <ul class="pagination">
                                    <li class="active"><span>1</span></li>
                                    <li><a href="">2</a></li><li><a href="">&gt;</a></li>
                                    <li><a href="">&gt;|</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <!-- //end Filters -->
                    <!--changed listings-->
                    <div class="products-list row grid">
                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/bird1.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px" />
                                        <img data-src="../images/demo/shop/product/bird2.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>
                                    <!--Sale Label-->
                                    <span class="label label-sale">Sale</span>
                                    <!--countdown box-->
                                    <div class="countdown_box">
                                        <div class="countdown_inner">
                                            <div class="title">This limited offer ends</div>

                                            <div class="defaultCountdown-30"></div>
                                        </div>
                                    </div>
                                    <!--end countdown box-->

                                    <!--full quick view block-->
                                    <a class="quickview  visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-18">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Bird: White-bellied Minivet</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$74.00</span>
                                            <span class="price-old">$122.00</span>
                                            <span class="label label-percent">-40%</span>
                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>It is distributed in Indochina Peninsula and southeast coastal areas of China, including Myanmar, Vietnam, Laos, Cambodia, Thailand, and southeast coastal areas of China, Hong Kong and Hainan Island. India subcontinent and southwest China, including India, Bangladesh, Bhutan, Sikkim, Nepal, Pakistan, Sri Lanka, Maldives, and Southeast Tibet of China.</p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-18'" /> <i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to " onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-18'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/cat11.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/cat22.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px" />
                                    </div>

                                    <!--full quick view block-->
                                    <a class="quickview  visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-14">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Cat: Munchkin cats</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$60.00</span>

                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>Mankicon is of medium build, slightly long body, round chest and strong buttocks. As the hind legs are longer than the forelimbs, the dorsal line from shoulder to tail rises slightly, and the female cat is thinner than the male cat. Having a pair of short feet is one of its features. The limbs are very short, and the hind limbs are longer than the forelimbs. </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-14'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-14'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-sm-block"></div><div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/dog3.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/dog4.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>
                                    <!--Sale Label-->
                                    <span class="label label-new">New</span>
                                    <span class="label label-sale">Sale</span>
                                    <!--countdown box-->
                                    <div class="countdown_box">
                                        <div class="countdown_inner">
                                            <div class="title">This limited offer ends</div>

                                            <div class="defaultCountdown-30"></div>
                                        </div>
                                    </div>
                                    <!--end countdown box-->

                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-8">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Dog: Samoyed</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$58.00</span>
                                            <span class="price-old">$172.00</span>
                                            <span class="label label-percent">-40%</span>
                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>The original breed of Samoye, a native of Siberia, is a breed of dog that is naughty and smart before the age of one year. It is alert, strong, flexible, beautiful, noble and elegant, clever and lovely, has a very eye-catching appearance, has the title of "smiling angel", also has the title of "smiling angel face, troublemaking the devil's heart". The color of samoyes is white; some of them are light brown, cheese and light brown. </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-8'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-8'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/dog1.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/dog2.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>
                                    <!--Sale Label-->
                                    <span class="label label-sale">Sale</span>
                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-9">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Dog: Golden Retriever</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$74.00</span>
                                            <span class="price-old">$122.00</span>
                                            <span class="label label-percent">-40%</span>
                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>It is a single hound, a popular breed of dogs. The swimming endurance is excellent when it is cultivated in the retriever dog hunting wild birds. Golden Retriever is one of the most common domestic dogs. It is easy to raise, patient and requires little from the owner. It can be done by regular exercise, food feeding and veterinary examination.  </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-9'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-9'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-sm-block"></div><div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/bird3.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/bird4.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>

                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-19">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>

                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Bird: Red-billed Starling</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$75.00</span>

                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>They are similar in size to other starlings, 20-23cm in length. The mouth is scarlet and the feet are orange. The head and neck of the male are mercerized white or brownish white, the back is dark gray, the chest is gray, and the back becomes pale, and the wings and tail are black. The female's head is brownish white at the front, dark gray at the back, grayish brown at the upper body and light grayish brown at the lower body, and the other birds are the same as the male. </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-19'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-19'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/pa3.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/pa4.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>

                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-13">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Reptiles: Lizard</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$89.00</span>
                                            <span class="price-old">$122.00</span>
                                            <span class="label label-percent">-40%</span>
                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>It is a kind of cold-blooded reptiles, with a wide variety, about 3000 species distributed on the earth, and more than 150 species known in China. Most of them are distributed in the tropics and subtropics. Their living environment is diverse, mainly terrestrial, arboreal, semi aquatic and burrowing.  </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-13'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-13'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-sm-block"></div><div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/pa1.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/pa2.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>

                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-11">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Reptiles: Centipede</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$120.00</span>

                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>A long, flat arthropod carnivore having a pair of feet in each segment. Since the Silurian period, 2800 species have survived. Like arthropods, they are known for their many arthropods. Centipede is an arthropod. They like to live in damp and dark places. </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-11'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-11'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/cat3.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/cat4.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>
                                    <!--Sale Label-->
                                    <span class="label label-sale">Sale</span>
                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-17">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Cat: Turkish Van</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$65.00</span>
                                            <span class="price-old">$145.00</span>
                                            <span class="label label-percent">-20%</span>
                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>Native to Turkey, it is long and strong in shape, with medium length long hair, white and shiny coat, and smooth as silk. In addition to the head, ears and tail of the body with cream yellow or light brown stripes, there is no hair, the appearance is very beautiful and lovely. </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-17'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-17'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>
                        <div class="clearfix visible-sm-block"></div><div class="clearfix visible-xs-block"></div>

                        <div class="product-layout col-md-4 col-sm-6 col-xs-12 ">
                            <div class="product-item-container">
                                <div class="left-block">
                                    <div class="product-image-container lazy second_img ">
                                        <img data-src="../images/demo/shop/product/fish1.jpg" src=""  alt="Apple Cinema 30&quot;" class="img-responsive" style=" width: 600px;height: 238px"/>
                                        <img data-src="../images/demo/shop/product/fish2.jpg" src=""  alt="Apple Cinema 30&quot;" class="img_0 img-responsive" style=" width: 600px;height: 238px"/>
                                    </div>

                                    <!--full quick view block-->
                                    <a class="quickview iframe-link visible-lg" data-fancybox-type="iframe"  href="/category/ViewItem?itemId=EST-1">  Quickview</a>
                                    <!--end full quick view block-->
                                </div>


                                <div class="right-block">
                                    <div class="caption">
                                        <h4><a href="product.html">Fish: Chocolate surgeonfish</a></h4>
                                        <div class="ratings">
                                            <div class="rating-box">
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i><i class="fa fa-star-o fa-stack-1x"></i></span>
                                                <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i></span>
                                            </div>
                                        </div>

                                        <div class="price">
                                            <span class="price-new">$97.00</span>
                                            <span class="price-old">$122.00</span>
                                            <span class="label label-percent">-40%</span>
                                        </div>
                                        <div class="description item-desc hidden">
                                            <p>Belonging to Perciformes, spiny tailed fish family and spiny tailed fish genus, it is a kind of tropical marine fish in Pan coral reef area. Black gill fish are distributed in the western and Southern Pacific, Indonesia, Malaysia and Tuvalu Island, and most of them live in the areas with abundant coral reefs. </p>
                                        </div>
                                    </div>

                                    <div class="button-group">
                                        <button class="addToCart" type="button" data-toggle="tooltip" title="Add to Cart" onclick="javascrtpt:window.location.href='/cart/AddItemtoCart?workingItemId=EST-1'"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs">Add to Cart</span></button>
                                        <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List" onclick="javascrtpt:window.location.href='/account/insertWish?Itemid=EST-1'"><i class="fa fa-heart"></i></button>
                                        <button class="compare" type="button" data-toggle="tooltip" title="Compare this Product" onclick="compare.add('42');"><i class="fa fa-exchange"></i></button>
                                    </div>
                                </div><!-- right block -->

                            </div>
                        </div>

                    </div>					<!--// End Changed listings-->
                    <!-- Filters -->
                    <div class="product-filter product-filter-bottom filters-panel" >
                        <div class="row">
                            <div class="col-md-2 hidden-sm hidden-xs">
                            </div>
                            <div class="short-by-show text-center col-md-7 col-sm-8 col-xs-12">
                                <div class="form-group" style="margin: 7px 10px">Showing 1 to 9 of 10 (2 Pages)</div>
                            </div>
                            <div class="box-pagination col-md-3 col-sm-4 text-right"><ul class="pagination"><li class="active"><span>1</span></li><li><a href="#">2</a></li><li><a href="#">&gt;</a></li><li><a href="#">&gt;|</a></li></ul></div>

                        </div>
                    </div>
                    <!-- //end Filters -->

                </div>

            </div>


        </div>
        <!--Middle Part End-->
    </div>
    <!-- //Main Container -->
    <!-- Footer Container -->
    <footer class="footer-container">
        <!-- Footer Top Container -->
        <section class="footer-top">
            <div class="container content">
                    <div class="col-sm-6 col-md-3 collapsed-block ">
                        <div class="module clearfix">
                            <h3 class="modtitle">Contact Us	</h3>
                            <div class="modcontent">
                                <ul class="contact-address">
                                    <li><span class="fa fa-map-marker"></span> My Company, 42 avenue des Champs Elysées 75000 Paris France</li>
                                    <li><span class="fa fa-envelope-o"></span> Email: <a href="#"> sales@yourcompany.com</a></li>
                                    <li><span class="fa fa-phone">&nbsp;</span> Phone 1: 0123456789 <br>Phone 2: (123) 4567890</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
        </section>
        <!-- /Footer Top Container -->

        <!-- Footer Bottom Container -->
        <div class="footer-bottom-block ">
            <div class=" container">
                <div class="row">
                    <div class="col-sm-5 copyright-text">Copyright &copy; 2017.Company name All rights reserved.<a target="_blank" href="#"></a></div>
                    <div class="col-sm-7">
                        <div class="block-payment text-right"><img src="../images/demo/content/payment.png" alt="payment" title="payment" ></div>
                    </div>
                    <!--Back To Top-->
                    <div class="back-to-top"><i class="fa fa-angle-up"></i><span> Top </span></div>

                </div>
            </div>
        </div>
        <!-- /Footer Bottom Container -->


    </footer>
    <!-- //end Footer Container -->

</div>


<!-- Cpanel Block -->
<div id="sp-cpanel_btn" class="isDown visible-lg">
    <i class="fa fa-cog"></i>
</div>

<div id="sp-cpanel" class="sp-delay">
    <h2 class="sp-cpanel-title"> Demo Options <span class="sp-cpanel-close"> <i class="fa fa-times"> </i></span></h2>
    <div id="sp-cpanel_settings">
        <div class="panel-group">
            <label>Color Scheme</label>
            <div class="group-schemes" >
                <span data-scheme="default"  class="item_scheme selected"><span style="background: #e8622d;"></span></span>
                <span data-scheme="blue" class="item_scheme"><span style="background: #478bca;"></span></span>
                <span data-scheme="boocdo"  class="item_scheme"><span style="background: #e54e4e;"></span></span>
                <span data-scheme="cyan" class="item_scheme"><span style="background: #1ea181;"></span></span>
                <span data-scheme="green" class="item_scheme "><span style="background: #52a633;"></span></span>

            </div>
        </div>

        <div class="panel-group ">
            <label>Header style</label>
            <div class="group-boxed">
                <select id="change_header_type" name="cpheaderstype" class="form-control" onchange="headerTypeChange(this.value);">
                    <option value="header-home1" >Header 1</option>
                    <option value="header-home2" >Header 2</option>
                    <option value="header-home3" >Header 3</option>
                    <option value="header-home4" >Header 4</option>
                </select>
            </div>
        </div>


        <div class="panel-group ">
            <label>Layout Box</label>
            <div class="group-boxed">
                <select id="cp-layoutbox" name="cplayoutbox" class="form-control" onchange="changeLayoutBox(this.value);">
                    <option value="full">Wide</option>
                    <option value="boxed">Boxed</option>
                    <option value="iframed">Iframed</option>
                    <option value="rounded">Rounded</option>
                </select>
            </div>
        </div>

        <div class="panel-group">
            <label>Body images</label>

            <div class="group-pattern">
                <div data-pattern="28"  class="img-pattern"><img src="../images/theme/patterns/28.png" alt="pattern 28"></div>
                <div data-pattern="29"  class="img-pattern"><img src="../images/theme/patterns/29.png" alt="pattern 29"></div>
                <div data-pattern="30"  class="img-pattern"><img src="../images/theme/patterns/30.png" alt="pattern 30"></div>
                <div data-pattern="31"  class="img-pattern"><img src="../images/theme/patterns/31.png" alt="pattern 31"></div>
                <div data-pattern="32"  class="img-pattern"><img src="../images/theme/patterns/32.png" alt="pattern 32"></div>
                <div data-pattern="33"  class="img-pattern"><img src="../images/theme/patterns/33.png" alt="pattern 33"></div>
                <div data-pattern="34"  class="img-pattern"><img src="../images/theme/patterns/34.png" alt="pattern 34"></div>
                <div data-pattern="35"  class="img-pattern"><img src="../images/theme/patterns/35.png" alt="pattern 35"></div>
                <div data-pattern="36"  class="img-pattern"><img src="../images/theme/patterns/36.png" alt="pattern 36"></div>
                <div data-pattern="37"  class="img-pattern"><img src="../images/theme/patterns/37.png" alt="pattern 37"></div>
                <div data-pattern="38"  class="img-pattern"><img src="../images/theme/patterns/38.png" alt="pattern 38"></div>
                <div data-pattern="39"  class="img-pattern"><img src="../images/theme/patterns/39.png" alt="pattern 39"></div>
                <div data-pattern="40"  class="img-pattern"><img src="../images/theme/patterns/40.png" alt="pattern 40"></div>
                <div data-pattern="41"  class="img-pattern"><img src="../images/theme/patterns/41.png" alt="pattern 41"></div>
                <div data-pattern="42"  class="img-pattern"><img src="../images/theme/patterns/42.png" alt="pattern 42"></div>
                <div data-pattern="43"  class="img-pattern"><img src="../images/theme/patterns/43.png" alt="pattern 43"></div>
                <div data-pattern="44"  class="img-pattern"><img src="../images/theme/patterns/44.png" alt="pattern 44"></div>
                <div data-pattern="45"  class="img-pattern"><img src="../images/theme/patterns/45.png" alt="pattern 45"></div>
            </div>
            <p class="label-sm">Background only applies for Boxed,Framed, Rounded Layout</p>
        </div>

        <div class="reset-group">
            <a href="index.html" class="btn btn-success " onclick="ResetAll()">Reset</a>
        </div>

    </div>

</div>



<link rel='stylesheet' property='stylesheet'  href='../css/themecss/cpanel.css' type='text/css' media='all' />


<!-- Preloading Screen -->
<div id="loader-wrapper">
    <div id="loader"></div>
    <div class="loader-section section-left"></div>
    <div class="loader-section section-right"></div>
</div>
<!-- End Preloading Screen -->

<!-- Include Libs & Plugins
	============================================ -->
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript" src="../js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/owl-carousel/owl.carousel.js"></script>
<script type="text/javascript" src="../js/themejs/libs.js"></script>
<script type="text/javascript" src="../js/unveil/jquery.unveil.js"></script>
<script type="text/javascript" src="../js/countdown/jquery.countdown.min.js"></script>
<script type="text/javascript" src="../js/dcjqaccordion/jquery.dcjqaccordion.2.8.min.js"></script>
<script type="text/javascript" src="../js/datetimepicker/moment.js"></script>
<script type="text/javascript" src="../js/datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="../js/jquery-ui/jquery-ui.min.js"></script>


<!-- Theme files
============================================ -->


<script type="text/javascript" src="../js/themejs/so_megamenu.js"></script>
<script type="text/javascript" src="../js/themejs/addtocart.js"></script>
<script type="text/javascript" src="../js/themejs/application.js"></script>
<script type="text/javascript" src="../js/themejs/cpanel.js"></script>

</body>
</html>
